﻿<html>
<head>
<META http-equiv="Content-Type" content="text/html; charset=UTF-8">
<LINK REL='stylesheet' HREF='../../release/SyntaxEditor-full.css' type='text/css'>
<script src="../../release/SyntaxEditor-full.js"></script>
</head>
<body>

<b>org.supertree.editor.SyntaxViewer</b>
<div id="viewer1"></div>
<script>

var s= "var a=0;\nif(a==0)\n{\n\ta=1;\n}\n";

$ec.$bind(
	"org.supertree.editor.SyntaxViewer",
	document.getElementById("viewer1"),
	{
		text:s,		//text as parameter
		rule:"Javascript"
	}
	);

</script>

<hr>
<b>org.supertree.editor.SyntaxEditor</b>
<div id="editor2" style="width:500px;height:300px;"></div>
<script>
$ec.$bind(
	"org.supertree.editor.SyntaxEditor",
	document.getElementById("editor2")
	);
$ec.bind["editor2"].SetText(s);	//dynamic set text
$ec.bind["editor2"].SetRule("Javascript");	//dynamic set rule
</script>

<hr>
<b>org.supertree.editor.SyntaxEditorEx</b>
<div>
	<div id="tool"></div>
	<div id="editor3" style="width:500px;height:300px;"></div>
</div>
<script>
$ec.$bind(
	"org.supertree.editor.SyntaxEditorEx",
	document.getElementById("editor3"),
	{
		text:s,		//text as parameter
		rule:"Javascript",
		bind:"a::<div>"		//focus when click on toolbar
	}
	);
$ec.bind["editor3"].CreateToolbar(document.getElementById("tool"));
</script>

</body>
</html>
